

<el-dialog id="form" v-loading="loading" :close-on-click-modal="false" v-cloak title="消息推送" :visible.sync="dialogVisible" width="50%">
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="right" size="small">
            <!--标题-->
	        <el-form-item  label="标题" prop="tittle">
	            <el-input
                        v-model="form.tittle"
                         :disabled="false"
                          :readonly="false"
                          :style="{width:  '100%'}"
                          :clearable="true"
                        placeholder="请输入标题">
                </el-input>
	        </el-form-item>   
        <!--内容-->	
	        <el-form-item  label="内容" prop="content">
	            <el-input
                        type="textarea" :rows="5"
                        :disabled="false"
                        :readonly="false"
                        v-model="form.content"
                        :style="{width: '100%'}"
                        placeholder="请输入内容">
                </el-input>
	        </el-form-item>
	   
        <!--推送时间-->
    
        <el-form-item  label="推送时间" prop="pushTime">
                <el-date-picker
                     v-model="form.pushTime"
placeholder="请选择推送时间"                    :readonly="false"
                    :disabled="false"
                    :editable="false"
                    :clearable="true"
                    format="yyyy-MM-dd hh-mm-ss"
                    value-format="yyyy-MM-dd hh-mm-ss"
                    :style="{width:'100%'}"
                    type="datetime">
            </el-date-picker>
        </el-form-item>
   
        <!--推送目标-->
    
        <el-form-item  label="推送目标" prop="pushPerson">
                    <el-select v-model="form.pushPerson"
                               :style="{width: '100%'}"
                               :filterable="true"
                               :disabled="false"
                    :multiple="true" :clearable="true"
                placeholder="请选择推送目标">
                        <el-option v-for='item in pushPersonOptions' :key="item.value" :value="item.value"
                                   :label="item.label"></el-option>
                    </el-select>
        </el-form-item>
   
            <!--消息状态-->
    </el-form>
    <div slot="footer">
        <el-button size="mini" @click="dialogVisible = false">取消</el-button>
        <el-button size="mini" type="primary" @click="save()" :loading="saveDisabled">保存</el-button>
    </div>
</el-dialog>
<script>
    var form = new Vue({
        el: '#form',
        data:function() {
            return {
                loading:false,
                saveDisabled: false,
                dialogVisible:false,
                // 推送目标
                pushPersonOptions:[],
                //表单数据
                form: {
                    // 标题
                    tittle:'',
                    // 内容
                    content:'',
                    //推送时间
                    pushTime:"",
                    // 推送目标
                    pushPerson:[],
                    // 消息状态
                    messageStatus:'01',
                    //推送目标姓名
                    //pushPersonName:''

                },
                rules:{
                        // 标题
                        tittle: [{"required":true,"message":"标题不能为空"},{"min":0,"max":255,"message":"标题长度必须为0-255"}],
                        // 内容
                        content: [{"required":true,"message":"内容不能为空"}],
                        // 推送时间
                        pushTime: [{"required":true,"message":"请选择推送时间"}],
                        // 推送目标
                        pushPerson: [{"required":true,"message":"请选择推送目标"}],

                },

            }
        },
        watch:{
               

            dialogVisible:function (v) {
                if(!v){
                    this.$refs.form.id=null;
                    this.$refs.form.resetFields();
                }
            }
        },
        components:{
        },
        computed:{
        },
        methods: {

            open:function(id){
                if (id) {
                    this.get(id);
                }
                this.$nextTick(function () {
                    this.dialogVisible = true;

                })
            },
            save:function() {
                var that = this;
                var url = ms.manager + "/cmsMessage/cmsMessage/save.do"
                if (that.form.id > 0) {
                    url = ms.manager + "/cmsMessage/cmsMessage/update.do";
                }
                this.$refs.form.validate(function(valid) {
                    if (valid) {
                        that.saveDisabled = true;
                        var form = JSON.parse(JSON.stringify(that.form));
                        if(form.pushPerson){
                            form.pushPerson = form.pushPerson.join(',');
                        }
                        ms.http.post(url, form).then(function (res) {
                            if (res.result) {
                                that.$notify({
                                    title: "成功",
                                    message: "保存成功",
                                    type: 'success'
                                });
                                that.dialogVisible = false;
                                indexVue.list();
                            } else {
                                that.$notify({
                                    title: "错误",
                                    message: res.msg,
                                    type: 'warning'
                                });
                            }

                            that.saveDisabled = false;
                        }).catch(function (err) {
                            console.err(err);
                            that.saveDisabled = false;
                        });
                    } else {
                        return false;
                    }
                })
            },

            //获取当前消息推送
            get:function(id) {
                var that = this;
                this.loading = true
                ms.http.get(ms.manager + "/cmsMessage/cmsMessage/get.do", {"id":id}).then(function (res) {
                    that.loading = false
                    if(res.result&&res.data) {
                                       //推送目标  数组数据就默认使用逗号分隔，如果有其他情况需要在这里做处理
                if(res.data.pushPerson){
                    res.data.pushPerson = res.data.pushPerson.split(',');
                }
                   
                        that.form = res.data;
                    }
                });
            },
                   //推送目标  列表格式化
		pushPersonFormat:function(row, column, cellValue, index){
			var value="";
                        
		        var that = this
			var con=[]
			if(cellValue){
				cellValue.split(',').forEach(function(item){
					var data = that.pushPersonOptions.find(function(value){
						return value.value==item;
					})
					if(data&&data.label){
						con.push(data.label);
					}
				})
			}
			value = con.join(',');

			return value;
		},

		//获取pushPerson数据源
		pushPersonOptionsGet:function() {
            var that = this;
            ms.http.get(ms.manager+'/cmsMessage/cmsMessage/personlist.do', {}).then(function (res) {
                that.pushPersonOptions = res.data;
            }).catch(function (err) {
                console.log(err);
                });
            },
        // 操作人选中项发生变化
        currOperatorChange(val) {
          var that = this
          console.log('选中', val)
          if (val) {
            console.log('数据集', this.pushPersonOptions)
            var con = [];
            val.forEach(function(item){
                var data = that.pushPersonOptions.find(function(value){
                    return value.value==item;
                })
                if(data&&data.label){
                    con.push(data.label);
                }
            })
            console.log('比对后', con)
            that.form.pushPersonName = con.join(',');
          } else {
            that.form.pushPersonName = ''
          }
        }

        },
        created:function() {
            var that = this;
//加载推送目标 数据
                this.pushPersonOptionsGet();
        }

    });

</script>